.link {
  font-weight: 600;
  padding: 0.575rem;
  font-size: var(--font-size);
  width: 100%;
  border-radius: 1rem;
  text-decoration: none;
  box-shadow: -1px 1px 1px 1px #66757f21;

  &-primary {
    @extend .link;
    color: var(--ifm-color-white);
    background-color: var(--red);

    &:hover {
      text-decoration: none;
      color: var(--ifm-color-white);
      filter: brightness(1.1);
    }
  }

  &-secondary {
    @extend .link;
    color: var(--verdaccio-color);
    background-color: var(--grey);

    &:hover {
      color: var(--ifm-color-emphasis-700);
      text-decoration: none;
      filter: brightness(0.99);
      box-shadow: -1px 1px 1px 1px #282e3121;
    }
  }
}
